body, html {
    margin: 0;
}
.index-container {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    //background-color: aqua;
    display: flex;
    flex-direction: column;

    .header {
        width: 100%;
        height: 60px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        background-color: #fff;
        border-bottom: solid 1px #dcdfe6;
        .header-icon {
            margin-left: 20px;
            font-size: x-large;
            color: #333;
            margin-top: 10px;
          .icon-img {
            height: 50px;
          }
        }
        .header-extra {
            margin-right: 20px;
            color: #333;
            font-size: small;
        }
    }
    .bottom {
        width: 100%;
        height: calc(100% - 60px);
        display: flex;
        flex-direction: row;

        .left {
            width: fit-content;
            height: 100%;

        }
        .right {
            flex-grow: 1;
            height: 100%;
            display: flex;
            flex-direction: column;
            .body {
                width: 100%;
                height: calc(100% - 44px);
            }
            .footer {
                width: 100%;
                height: 44px;
                line-height: 44px;
                border-top: solid 1px #dcdfe6;
                font-size: small;
                color: gray;
                padding-left: 20px;
            }
        }
    }
    //<div class="index-container">
    //<div class="header">
    //
    //</div>
    //<div class="bottom">
    //<div class="left">
    //
    //</div>
    //<div class="right">
    //<NuxtPage></NuxtPage>
    //</div>
    //</div>
    //</div>
}